<template>
    <div class="entry_list">
        <router-link to="/bom" class="list list_0">
            <div class="ico">
                <img :src="sBomUrl" alt="">
            </div>
            <p class="title">BOM物料查询</p>
        </router-link>
        <router-link to="/pos" class="list list_1">
            <div class="ico">
                <img :src="sPosUrl" alt="">
            </div>
            <p class="title">机身号(SN)查询</p>
        </router-link>
    </div>
</template>
<script>
import sBom from '@/assets/image/bomIco.png';
import sPos from '@/assets/image/posIco.png'
export default {
    data(){
        return{
            sBomUrl:sBom
            ,sPosUrl:sPos
        }
    }
}
</script>
<style lang="less">
.entry_list{
    .list{
       width: 200px;
       height: 120px; 
       display: inline-block;
       font-size: 16px;
       font-weight: bold;
       color: #fff;
       padding-left: 50px;
       position: relative;
       margin: 5px;
       &:hover{
        opacity: 0.8;
       }
       .ico{
           width: 40px;
           height: 40px;
           background: #ffffff;
           display: block;
           border-radius: 50%;
           position: absolute;
           left: 20px;
           top: 50%;
           margin-top: -20px;
           img{
               width: 60%;
               height: auto;
               vertical-align: top;
               margin-top: 20%;
               
           }
       }
       .title{
           line-height: 120px;
       }
    }
    .list_0{
        background:#48c79c;
    }
    .list_1{
        background: #ddbd79;
    }
}
</style>